<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>作品</title>
    <link rel="stylesheet" href="css/zp.css">
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
</head>
<body>
        <div class="top">
                <div class="top-frame">
                    <div class="top-left">
                        <img src="images/pikaqiu.gif" alt="">
                    </div>
                   <div class="top-left-font">
                       <h2 style="color:white">这是我的作品</h2>
                   </div>
                   <div class="top-right-font">
                       <h2 style="color:white">喜欢就<a href="https://www.yuque.com/dashboard" target="_blank">关注</a>吧</h2>
                   </div>
                    <div class="logo">
                        
                     <a href="../index.html"> <img src="images/logo.jpg" alt=""></a>   
                    </div>
                    <div class="top-right">
                         
                         <img src="images/pikaqiu.gif" alt="">
                         
                     </div>
                 </div>
            </div>  
            <div class="main-frame">
                <div class=" xg-frame">
                        <div class="my-pic">
                                <div> <img src="images/me.png" alt=""></div>
                                <div class="erweima"> <img src="images/erweima.png" alt="" ></div>
                            </div>
                    <d`iv class="xg">
                        <div class="lianxi xg-content">
                            <a href="../index.html">
                                <div class="xg-pic-g">
                                    <img src="images/pika-g.png" alt="">
                                </div>
                                <div class="xg-pic-k">
                                    <img src="images/pika-k.png" alt="">
                                </div>
                                <span class="xg-cont"><strong>首页</strong></span>
                            </a>
                        </div>
                        <div class="xg-content">
                                <a href="../生活/index.html">
                                    <div class="xg-pic-g">
                                        <img src="images/pika-g.png" alt="">
                                    </div>
                                    <div class="xg-pic-k">
                                        <img src="images/pika-k.png" alt="">
                                    </div>
                                    <span class="xg-cont"><strong>生活</strong></span>
                                </a>
                            </div>
                            <div class="lianxi xg-content">
                                   
                                        <div class="xg-pic-g">
                                            <img src="images/pika-g.png" alt="">
                                        </div>
                                        <div class="xg-pic-k">
                                            <img src="images/pika-k.png" alt="">
                                        </div>
                                        <span class="xg-cont"><strong>联系</strong></span>
                                    
                                </div>
                    </d`iv>
                </div>
                <div class="work-frame">
                    
                    <a href="images/works/关于远大/index.html"target="_blank" class="work">
                        <img src="images/works/关于远大/关于远大.jpg" alt="">
                        <span class="work-cont">关于远大</span>
                    </a>
                    <a href="images/works/家居医生/index.html" target="_blank"class="work">
                        <img src="images/works/家居医生/pc01.png" alt="">
                        <span class="work-cont">家具医生</span>
                    </a>
                    <div class="work-font">
                        <img src="images/ceb.png" alt="">
                    </div>
                    <a href="images/works/小米登陆/index.html" target="_blank"class="work">
                        <img src="images/works/小米登陆/小米帐号 - 登录.png" alt="">
                        <span class="work-cont">小米登录</span>
                    </a>
                    <a href="images/works/木兮地板/index.html"target="_blank" class="work">
                         <img src="images/works/木兮地板/muxi.png" alt="">
                         <span class="work-cont">木兮地板</span>
                    </a>
                    <div class="work">
                           <img src="images/works/小程序/wechat02.png" alt="">
                           <span class="work-cont">音乐小程序</span>
                    </div>
                    <a href="images/works/小米商城/index.html" target="_blank"class="work">
                           <img src="images/works/小米商城/小米官网.png" alt="">
                           <span class="work-cont">小米商城</span>
                    </a>

                </div>    
            </div>
           
            <script>
                    $(".lianxi>span>strong").click(function(){
                    $(".my-pic>div").eq($(this).index()).hide().siblings().show();
                   })
                    </script>
</body>
</html>